<ion-view view-title="供应商详情" show-tabs>
    <ion-nav-buttons side="right">
        <button class="button" ng-class="{'button-icon ion-ios-compose-outline':!$root.isEdit,'button-clear':$root.isEdit}" ng-click="$root.toggleEdit();"><span ng-if="$root.isEdit">取消</span></button>
    </ion-nav-buttons>

    <ion-content class="wrap-light2">
		<ion-list>
			<form name="updateSupplierForm" ng-submit="$root.toggleEdit();update();" ng-class="{'editing':$root.isEdit}">
				<ion-item class="item item-input item-icon-left">
				    <i class="icon ion-ios-folder-outline dark2"></i>
				    <span class="input-label">分类</span>
				    <input type="text" name="category" maxlength="20" required placeholder="分类" ng-model="supplier.category" ng-readonly="!$root.isEdit">
				    <span class="ion-minus-circled" ng-show="updateSupplierForm.category.$dirty && updateSupplierForm.category.$invalid "></span>
				</ion-item>
				<ion-item class="item item-input item-icon-left">
				    <i class="icon ion-ios-home-outline dark2"></i>
				    <span class="input-label">名称</span>
				    <input type="text" name="name" maxlength="20" required placeholder="公司名称" ng-model="supplier.company" ng-readonly="!$root.isEdit">
				    <span class="ion-minus-circled" ng-show="updateSupplierForm.name.$dirty && updateSupplierForm.name.$invalid "></span>
				</ion-item>
				<ion-item class="item item-input item-icon-left">
					<span class="input-label">电话</span>
				    <i class="icon ion-ios-telephone-outline dark2"></i>
				    <input type="text" name="tel" maxlength="20" required placeholder="区号-号码" ng-model="supplier.tel" ng-pattern="'\\d{3,5}-\\d{6,9}'" ng-readonly="!$root.isEdit">
				    <span class="ion-minus-circled" ng-show="updateSupplierForm.tel.$dirty && updateSupplierForm.tel.$invalid "></span>
				</ion-item>


				<ion-item class="item-input item-icon-left" ng-if="$root.isEdit">
				    <i class="icon ion-ios-location-outline dark2"></i>
				    <span class="input-label">地址</span>
				    <input type="text" name="province" maxlength="10" required placeholder="省" ng-model="supplier.address.province" />
				    <input type="text" name="city" maxlength="10" required placeholder="市" ng-model="supplier.address.city" />
				    <input type="text" name="region" maxlength="10" required placeholder="区" ng-model="supplier.address.region" />
			    </ion-item>
			    <ion-item class="item-input item-borderless item-icon-left" ng-if="$root.isEdit">
			    	<span class="input-label"></span>
				    <input type="text" name="street" maxlength="50" required placeholder="详细地址" ng-model="supplier.address.street" />
				</ion-item>
				<ion-item class="item-base item-icon-left item-icon-right" ng-if="!$root.isEdit">
				    <i class="icon ion-ios-location-outline dark2"></i>
				    <span class="input-label">地址</span>
				    <span>{{supplier.address.province}}</span><span>{{supplier.address.city}}</span><span>{{supplier.address.region}}</span><span>{{supplier.address.street}}</span>
				</ion-item>

				<ion-item class="margin-top-large item-divider">
				    联系人
				</ion-item>
				<div ng-repeat="contact in supplier.contact_list track by $index" class="margin-bottom-large">
					<ion-item class="item item-input item-icon-left">
					    <i class="icon ion-ios-person-outline dark2"></i>
					    <span class="input-label">称呼</span>
					    <input type="text" name="uname" maxlength="20" required placeholder="姓名" ng-model="contact.name" ng-readonly="!$root.isEdit">
					    <span class="ion-minus-circled" ng-show="updateSupplierForm.uname.$dirty && updateSupplierForm.uname.$invalid "></span>
					</ion-item>




					<ion-item class="item-input item-icon-left" ng-repeat="phone in contact.phones track by $index" ng-if="contact.phones[$index].value || $root.isEdit">
					    <i class="icon ion-iphone dark2"></i>
					    <span class="input-label">手机{{$index + 1}}</span>
					    <input type="text" name="type{{$index}}" maxlength="5" required placeholder="标签" ng-model="phone.type" ng-if="$root.isEdit">
					    <input type="text" name="phone{{$index}}" maxlength="11" required placeholder="手机号码" ng-model="phone.value" ng-readonly="!$root.isEdit">
					    <span ng-if="!$root.isEdit" class="item-note">{{phone.type}}</span>
					    <span class="ion-minus-circled" ng-show= "updateSupplierForm.phone[$index].value.$dirty && updateSupplierForm.phone[$index].value.$invalid "></span>
					</ion-item>

					<ion-item class="item-input item-icon-left" ng-repeat="email in contact.emails track by $index" ng-if="contact.emails[$index].value || $root.isEdit">
					    <i class="icon ion-ios-email-outline dark2"></i>
					    <span class="input-label">邮箱</span>
					    <input type="email" name="email" maxlength="30" required placeholder="E-Mail" ng-model="email.value" ng-readonly="!$root.isEdit">
					    <span class="ion-minus-circled" ng-show="updateSupplierForm.email[$index].value.$dirty && updateSupplierForm.email[$index].value.$invalid "></span>
					</ion-item>

					
				</div>

				<ion-item class="item item-input item-icon-left" ng-if="supplier.remark || $root.isEdit">
				    <textarea rows="3" ng-model="supplier.remark" placeholder="备注" ng-readonly="!$root.isEdit"></textarea>
				</ion-item>
		  
		        <button class="button button-block button-balanced" ng-if="$root.isEdit" type="submit">保存</button>
	  		</form>
	  		<button class="button button-block button-assertive" ng-if="!$root.isEdit" ng-click="delete();">删除供应商</button>
		</ion-list>
	</ion-content>
</ion-view>
